<template>
	<view>
		<!-- 组件盒子 -->
		<view class="container dflex alc jcsb pr60">
			<!-- 左边部分 -->
			<view class="left dflex alc">
				<!-- 图片部分 -->
				<view class="img dflex alc jcc">
					<image :src="data.img" mode="widthFix"></image>
				</view>
				<!-- 文字部分 -->
				<view class="text dflex flexc jcsb fs22 gray fw500 pl20">
					<view class="fs28 black fw900">{{data.name}}</view>
					<view class="dflex">
						<view>已售:{{data.sold}}</view>
						<view class="pl30">库存:{{data.stock}}</view>
					</view>
					<view>补货:{{data.replenishment}}</view>
				</view>
			</view>
			<!-- 右边部分 -->
			<view class="right fs28 fw900 red">￥{{data.price}}</view>
		</view>
	</view>
</template>

<script>
export default {
	name: 'OrderMessage',
	props:['data'],
	data() {
		return {};
	},
	mounted() {
		console.log(this.data);
	}
};
</script>

<style lang="scss" scoped>
.container {
	.left {
		.img {
			width: 130rpx;
			height: 130rpx;
			background: #e6f4fc;
			border-radius: 20rpx 20rpx 20rpx 20rpx;
			image {
				width: 126rpx;
				height: 126rpx;
			}
		}
		.text{
			height: 130rpx;
		}
	}
}
</style>
